%head {
  height: 50px;
  line-height: 50px;
  padding: 0px 20px;
  border-bottom: 1px solid #dddddd;
  color: #333333;
  font-size: 15px;
  // font-family: SimSun;
}


.survey-container {
  width: 100%;
  height: 100%;
  padding: 32px;
  display: flex;
  justify-content: center;
  align-items: left;

  .survey-left {
    width: 70%;
    min-width: 670px;
    padding-right: 32px;

    .left-chart {
      float: right;
      width: 40%;
      height: 100%;
      min-height: 260px;
      background-color: white;
      box-shadow: 0px 0px 8px #ddd;

      .chart-head {
        @extend %head;
      }

      .charts {
        height: 100%;
        width: 100%;
        min-height: 210px;
      }
    }

    .wether-con {
      padding-right: 32px;
      box-sizing: border-box;
      float: left;
      width: 30%;
      height: 100%;
    }

    .left-wether {

      box-sizing: border-box;
      float: left;
      width: 100%;
      height: 100%;
      // min-height: 260px;
      background-color: white;
      box-shadow: 0px 0px 8px #ddd;

      .chart-head {
        @extend %head;
      }

 

      .wether-ctn {
        span {
          display: inline-block;
        }

        .info {
          font-size: 20px;
          color: #333333;
          vertical-align: -56%;
        }

        .num {
          float: right;
          font-size: 30px;
          font-weight: 500;
        }

      }

      .e-ctn {
        padding: 10px;

        p {
          line-height: 32px;
        }
      }
    }

    .left-info {
      width: 100%;
      height: 64%;
      min-height: 400px;
      padding-top: 32px;
      display: flex;
      justify-content: center;
      align-items: left;

      .geography {
        width: 60%;
        height: 100%;
        min-width: 355px;
        padding-right: 32px;

        .content {
          height: 100%;
          width: 100%;
          background-color: white;
          box-shadow: 0px 0px 8px #ddd;

          .content-head {
            @extend %head;
          }

          .content-body {
            height: calc(100% - 50px);
            padding: 10px 10px;
          }
        }
      }

      .personnel {
        width: 40%;
        height: 100%;
        min-width: 290px;
        background-color: white;
        box-shadow: 0px 0px 8px #ddd;

        .personnel-head {
          @extend %head;
        }

        .personnel-content {
          height: calc(100% - 50px);
          padding: 10px 10px;
          overflow: auto;

          .personnels {
            height: 100px;
            overflow: hidden;
            min-width: 177px;

            .left {
              float: left;
              width: 50px;
              height: 50px;
              border-radius: 50px;
              margin: 20px 10px;
              background-image: url('./../../../../assets/images/project/header_default.png');
              background-repeat: no-repeat;
              background-size: 100% 100%;
            }

            // .left-l {
            //   float: left;
            //   width: 50px;
            //   height: 50px;
            //   border-radius: 50px;
            //   margin: 20px 10px;
            //   background-image: url('./../../../../assets/images/project/lxq.jpg');
            //   background-repeat: no-repeat;
            //   background-size: 100% 100%;
            // }

            .right {
              float: left;
              margin: 15px 10px;

              .list {
                height: 30px;
                line-height: 30px;
                overflow: hidden;
              }
            }
          }
        }
      }
    }
  }

  .survey-right {
    width: 30%;
    min-width: 280px;
    background-color: white;
    box-shadow: 0px 0px 8px #ddd;

    .right-head {
      @extend %head;
    }

    .right-body {
      width: 100%;
      height: calc(100% - 50px);
      padding: 25px 25px;
      overflow: auto;

      .img {
        width: 100%;
        height: 200px;
        background-image: url('./../../../../assets/images/project/sdf.png');
        background-repeat: no-repeat;
        background-size: 100% 100%;
      }

      .list {
        margin-top: 15px;
      }
    }
  }

}

::-webkit-scrollbar-track-piece {
  //滚动条凹槽的颜色，还可以设置边框属性
  background-color: white;
  border-radius: 10px;
}

::-webkit-scrollbar {
  //滚动条的宽度
  width: 9px;
  height: 9px;
}

::-webkit-scrollbar-thumb {
  //滚动条的设置
  background-color: white;
  background-clip: padding-box;
  min-height: 28px;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: white;
}

iframe {
  .head {
    display: none;
  }
}
